@extends('admin.superadmin.layout.layout')
@section('content')
<div class="row">
    <div class="col-lg-12">
            <h1 class="page-header">轮播列表</h1>
        <div class="panel panel-default">
           
            
            <div class="panel-body">
                <div class="dataTable_wrapper">
                    <div id="dataTables-example_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">

                    <form action="" method="get">
                    <div class="row">
                       
                    </form>
                    </div>
                   
                    <div class="row">
                         <div class="col-sm-12">
                            <table class="table table-striped table-bordered table-hover dataTable no-footer" id="dataTables-example" role="grid" aria-describedby="dataTables-example_info" style="text-align:center">
                        <thead style="text-align:center">
                            <tr role="row">
                                <th style="text-align:center" class="sorting_asc" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" style="width: 80px;" aria-sort="ascending" aria-label="Rendering engine: activate to sort column descending">ID</th>
                                
                                <th style="text-align:center" class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending">书籍名称</th>
                                <th style="text-align:center" class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" aria-label="Platform(s): activate to sort column ascending">书籍简介</th>
                                <th style="text-align:center" class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" aria-label="Engine version: activate to sort column ascending">书籍封面</th>
                                <th style="text-align:center" class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" aria-label="CSS grade: activate to sort column ascending">操作</th></tr>
                        </thead>

                        <tbody>

                    @foreach($res as $k=>$v)
                        <tr class="gradeA odd" role="row">
                            <td class="sorting_1 sid">{{$v->id}}</td>
                            
                            <td>{{$v->b_name}}</td>
                            <td>{{$v->b_desc}}</td>

                            <td class="center">
                                <img class="small" src="{{$v->b_pic}}" style="width:50px;">
                                <div class="big" style="width:200px;display:none;position:absolute;"><img  src="{{$v->b_pic}}"></div>
                            </td>
                        
                            <td class="center">
                            <a href="{{url('/admin/superadmin/shuffling/top',['id'=>$v->id])}}" class="fa fa-arrow-circle-up  ">置顶</a>
                            &nbsp;&nbsp;|&nbsp;&nbsp;
                         
                            </td>
                        </tr>

                        <script type="text/javascript">
                        //获取元素对象
                        var small = document.getElementsByClassName('small');

                        var big = document.getElementsByClassName('big');

                        //鼠标移入事件
                        small.onmousemove = function()
                        {
                            this.style.display = 'none';
                            this.nextElementSibling.style.display = 'block';

                        }  

                        big.onmouseout = function()
                        {
                            this.style.display = 'none';
                            this.prevousElementSibing.style.display = 'block';
                        }  


                        </script>

                    @endforeach
                       
                        </tbody>
                    </table>
                    </div>
                    </div>

                    <div class="row">
                        <div class="col-sm-6">
                        <div class="dataTables_info" id="dataTables-example_info" role="status" aria-live="polite"></div>
                        </div>
                      
                       
                      
                    </div>    
                </div>
                <!-- /.panel-body -->
            </div>
            <!-- /.panel -->
        </div>
        <!-- /.col-lg-12 -->
    </div>    
  
@endsection

